<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>在线考试平台</title>
    <link rel="shortcut icon" href="../images/exam.png" type="image/x-icon">
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/xadmin.css">

</head>

<body>
<div class="layui-fluid">

    <div class="layui-row layui-col-space15" style="background: #f7f8fc">
        <div class="layui-tab layui-tab-brief" lay-filter="question_type">
            <ul class="layui-tab-title">
                <li class="layui-this" value="0">单选题</li>
                <li value="1">判断题</li>
                <li value="2">简答题</li>
                <li value="3">填空题</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-row layui-col-space15">
                    <div id="choice_question">
                        <form class="layui-form layui-form-pane" action="">
                            <div class="layui-form-item">
                                <label class="layui-form-label">题目</label>
                                <div class="layui-input-block">
                                    <input type="text" name="c_describe" lay-verify="required" autocomplete="off"
                                           placeholder="请输入内容"
                                           class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">选项A</label>
                                <div class="layui-input-block">
                                    <input type="text" name="c_a" autocomplete="off" lay-verify="required"
                                           placeholder="请输入内容"
                                           class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">选项B</label>
                                <div class="layui-input-block">
                                    <input type="text" name="c_b" autocomplete="off" lay-verify="required"
                                           placeholder="请输入内容"
                                           class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">选项C</label>
                                <div class="layui-input-block">
                                    <input type="text" name="c_c" autocomplete="off" lay-verify="required"
                                           placeholder="请输入内容"
                                           class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">选项D</label>
                                <div class="layui-input-block">
                                    <input type="text" name="c_d" autocomplete="off" lay-verify="required"
                                           placeholder="请输入内容" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item" pane="">
                                <label class="layui-form-label">正确答案</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="c_answer" value="A" title="A" checked="">
                                    <input type="radio" name="c_answer" value="B" title="B">
                                    <input type="radio" name="c_answer" value="C" title="C">
                                    <input type="radio" name="c_answer" value="D" title="D">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">所属科目</label>
                                <div class="layui-input-block">
                                    <select name="s_id" class="subject">
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">难度级别</label>
                                <div class="layui-input-block">
                                    <select name="c_level">
                                        <option value="简单">简单</option>
                                        <option value="中等">中等</option>
                                        <option value="困难">困难</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">答案解析</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" name="c_analysis" class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn" lay-submit="" lay-filter="add_choice_question">提交</button>
                            </div>
                        </form>
                    </div>
                    <div id="judgment_question">
                        <form class="layui-form layui-form-pane" action="">
                            <div class="layui-form-item">
                                <label class="layui-form-label">题目</label>
                                <div class="layui-input-block">
                                    <input type="text" name="j_describe" lay-verify="required" autocomplete="off"
                                           placeholder="请输入内容"
                                           class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item" pane="">
                                <label class="layui-form-label">正确答案</label>
                                <div class="layui-input-block">
                                    <input type="radio" name="j_answer" value="对" title="对" checked="">
                                    <input type="radio" name="j_answer" value="错" title="错">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">所属科目</label>
                                <div class="layui-input-block">
                                    <select name="s_id" class="subject">
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">难度级别</label>
                                <div class="layui-input-block">
                                    <select name="j_level">
                                        <option value="简单">简单</option>
                                        <option value="中等">中等</option>
                                        <option value="困难">困难</option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">答案解析</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" name="j_analysis" class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn" lay-submit="" lay-filter="add_judgment_question">提交</button>
                            </div>
                        </form>
                    </div>

                    <div id="short_answer_question">
                        <form class="layui-form layui-form-pane" action="">
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">题目</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" lay-verify="required" name="sa_describe"
                                              class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">正确答案</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" lay-verify="required" name="sa_answer"
                                              class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">所属科目</label>
                                <div class="layui-input-block">
                                    <select name="s_id" class="subject">
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">难度级别</label>
                                <div class="layui-input-block">
                                    <select name="sa_level">
                                        <option value="简单">简单</option>
                                        <option value="中等">中等</option>
                                        <option value="困难">困难</option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">答案解析</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" name="sa_analysis" class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn" lay-submit="" lay-filter="add_short_answer_question">提交
                                </button>
                            </div>
                        </form>
                    </div>

                    <div id="fill_blanks_question">
                        <form class="layui-form layui-form-pane" action="">
                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">题目</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" lay-verify="required" name="fb_describe"
                                              class="layui-textarea"></textarea>
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">答案</label>
                                <div id="fb_answer">
                                    <div class="fb_answer">
                                        <div class="layui-input-inline">
                                            <input type="text" name="a_one" autocomplete="off" lay-verify="required"
                                                   placeholder="请输入内容"
                                                   class="layui-input">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-input-inline">
                                    <button type="button" class="layui-btn layui-btn-sm layui-btn-normal"
                                            onclick="add_fill_blanks()">添加
                                    </button>
                                    <button type="button" class="layui-btn layui-btn-sm layui-btn-danger"
                                            onclick="del_fill_blanks()">删除
                                    </button>
                                </div>
                                <div class="layui-form-mid layui-word-aux"><span style="color: red">*</span>请依次输入每空答案
                                </div>
                            </div>

                            <div class="layui-form-item">
                                <label class="layui-form-label">所属科目</label>
                                <div class="layui-input-block">
                                    <select name="s_id" class="subject">
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">难度级别</label>
                                <div class="layui-input-block">
                                    <select name="fb_level">
                                        <option value="简单">简单</option>
                                        <option value="中等">中等</option>
                                        <option value="困难">困难</option>
                                    </select>
                                </div>
                            </div>

                            <div class="layui-form-item layui-form-text">
                                <label class="layui-form-label">答案解析</label>
                                <div class="layui-input-block">
                                    <textarea placeholder="请输入内容" name="fb_analysis" class="layui-textarea"></textarea>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <button class="layui-btn" lay-submit="" lay-filter="add_fill_blanks_question">提交
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
<script type="text/javascript"  src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script>
    layui.use(['element', "form", 'jquery', 'layer'], function () {
        const form = layui.form;
        const $ = layui.jquery;
        const layer = layui.layer;
        const element = layui.element;

        $("#judgment_question").hide();
        $("#short_answer_question").hide();
        $("#fill_blanks_question").hide();
        element.on('tab(question_type)', function (data) {
            var type = $(this).attr('value')
            if (type === '0') {
                $("#short_answer_question").hide();
                $("#judgment_question").hide();
                $("#fill_blanks_question").hide();
                $("#choice_question").show();
            } else if (type === '1') {
                $("#choice_question").hide();
                $("#short_answer_question").hide();
                $("#fill_blanks_question").hide();
                $("#judgment_question").show();
            } else if (type === '2') {
                $("#choice_question").hide();
                $("#judgment_question").hide();
                $("#fill_blanks_question").hide();
                $("#short_answer_question").show();
            } else if (type === '3') {
                $("#choice_question").hide();
                $("#short_answer_question").hide();
                $("#judgment_question").hide();
                $("#fill_blanks_question").show();
            }
        });

        form.on("submit(add_choice_question)", function (data) {
            // alert(JSON.stringify({c_describe: data.field.c_describe,
            //     c_a: data.field.c_a,
            //     c_b: data.field.c_b,
            //     c_c: data.field.c_c,
            //     c_d: data.field.c_d,
            //     c_answer: data.field.c_answer,
            //     s_id: data.field.s_id,
            //     c_level: data.field.c_level,
            //     c_analysis: data.field.c_analysis}))
            var c_analysis = data.field.c_analysis;
            if (data.field.c_analysis.length === 0) {
                c_analysis = "暂无解析";
            }
            $.ajax({
                url: 'add_choice_question',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                data: {
                    c_describe: data.field.c_describe,
                    c_a: data.field.c_a,
                    c_b: data.field.c_b,
                    c_c: data.field.c_c,
                    c_d: data.field.c_d,
                    c_answer: data.field.c_answer,
                    s_id: data.field.s_id,
                    c_level: data.field.c_level,
                    c_analysis: c_analysis
                },
                success: function (data) {
                    if (data.code === 0) {
                        layer.msg(data.message, {icon: 5, time: 1000})
                    } else if (data.code === 200) {
                        layer.msg(data.message, {icon: 6, time: 1000}, function () {
                            window.location.reload();
                        })
                    } else {
                        layer.msg('系统繁忙', {icon: 5, time: 1000})
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
            return false
        });

        form.on("submit(add_judgment_question)", function (data) {
            // alert(JSON.stringify({j_describe: data.field.j_describe,
            //     j_answer: data.field.j_answer,
            //     s_id: data.field.s_id,
            //     j_level: data.field.j_level,
            //     j_analysis: data.field.j_analysis}))
            var j_analysis = data.field.j_analysis
            if (data.field.j_analysis.length === 0) {
                j_analysis = "暂无解析";
            }
            $.ajax({
                url: 'add_judgment_question',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                data: {
                    j_describe: data.field.j_describe,
                    j_answer: data.field.j_answer,
                    s_id: data.field.s_id,
                    j_level: data.field.j_level,
                    j_analysis: j_analysis
                },
                success: function (data) {
                    if (data.code === 0) {
                        layer.msg(data.message, {icon: 5, time: 1000})
                    } else if (data.code === 200) {
                        layer.msg(data.message, {icon: 6, time: 1000}, function () {
                        })
                    } else {
                        layer.msg('系统繁忙', {icon: 5, time: 1000})
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
            return false
        });

        form.on("submit(add_fill_blanks_question)", function (data) {
            // alert(JSON.stringify({sa_describe: data.field.sa_describe,
            //     sa_answer: data.field.sa_answer,
            //     s_id: data.field.s_id,
            //     sa_level: data.field.sa_level,
            //     sa_analysis: data.field.sa_analysis}))
            var fb_answer_data=[]
            var fb_analysis = data.field.fb_analysis
            if (data.field.fb_analysis.length === 0) {
                fb_analysis = "暂无解析";
            }
            $(".fb_answer input").each(function () {
                console.log(this.value);
                fb_answer_data.push(this.value);
            })
            $.ajax({
                url: 'add_fill_blanks_question',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                data: {
                    fb_describe: data.field.fb_describe,
                    fb_answer: fb_answer_data.toString(),
                    s_id: data.field.s_id,
                    fb_level: data.field.fb_level,
                    fb_analysis: fb_analysis
                },
                success: function (data) {
                    if (data.code === 0) {
                        layer.msg(data.message, {icon: 5, time: 1000})
                    } else if (data.code === 200) {
                        layer.msg(data.message, {icon: 6, time: 1000}, function () {
                        })
                    } else {
                        layer.msg('系统繁忙', {icon: 5, time: 1000})
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
            return false
        });

        form.on("submit(add_short_answer_question)", function (data) {
            // alert(JSON.stringify({sa_describe: data.field.sa_describe,
            //     sa_answer: data.field.sa_answer,
            //     s_id: data.field.s_id,
            //     sa_level: data.field.sa_level,
            //     sa_analysis: data.field.sa_analysis}))
            var sa_analysis = data.field.sa_analysis
            if (data.field.sa_analysis.length === 0) {
                sa_analysis = "暂无解析";
            }
            $.ajax({
                url: 'add_short_answer_question',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                data: {
                    sa_describe: data.field.sa_describe,
                    sa_answer: data.field.sa_answer,
                    s_id: data.field.s_id,
                    sa_level: data.field.sa_level,
                    sa_analysis: sa_analysis
                },
                success: function (data) {
                    if (data.code === 0) {
                        layer.msg(data.message, {icon: 5, time: 1000})
                    } else if (data.code === 200) {
                        layer.msg(data.message, {icon: 6, time: 1000}, function () {
                        })
                    } else {
                        layer.msg('系统繁忙', {icon: 5, time: 1000})
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
            return false
        });

        get_all_subject();
    });


    function add_fill_blanks() {
        var text = "<div class=\"fb_answer\">" +
            "             <div class=\"layui-input-inline\">" +
            "               <input type=\"text\" name=\"a_one\" autocomplete=\"off\" lay-verify=\"required\" placeholder=\"请输入内容\" class=\"layui-input\">" +
            "              </div>" +
            "        </div>"
        $("#fb_answer").append(text)
    }

    function del_fill_blanks() {
        $("div[id='fb_answer'] div[class='fb_answer']:last").remove()
    }


    function get_all_subject() {
        layui.use(['element', "form", 'jquery', 'layer'], function () {
            const form = layui.form;
            $.ajax({
                url: 'get_all_subject',
                dataType: "json",//数据格式
                type: "post",//请求方式
                async: false,//是否异步请求
                success: function (data) {
                    if (data.code === 200) {
                        var text = ""
                        for (let i = 0; i < data.result.length; i++) {
                            text += "<option value=\"" + data.result[i].s_id + "\">" + data.result[i].s_name + "</option>"
                        }
                        $(".subject").html(text);
                        form.render();
                    }
                },
                error: function (e) {
                    alert("出现错误！！");
                }
            });
        })
    }

    function getDateDiff(dateTimeStamp) {
        var minute = 1000 * 60;
        var hour = minute * 60;
        var day = hour * 24;
        var halfamonth = day * 15;
        var month = day * 30;
        var now = new Date().getTime();
        var diffValue = now - dateTimeStamp;
        if (diffValue < 0) {
            //若日期不符则弹出窗口告之
            //alert("结束日期不能小于开始日期！");
        }
        var monthC = diffValue / month;
        var weekC = diffValue / (7 * day);
        var dayC = diffValue / day;
        var hourC = diffValue / hour;
        var minC = diffValue / minute;
        if (monthC >= 1) {
            result = "创建于" + parseInt(monthC) + "个月前";
        } else if (weekC >= 1) {
            result = "创建于" + parseInt(weekC) + "周前";
        } else if (dayC >= 1) {
            result = "创建于" + parseInt(dayC) + "天前";
        } else if (hourC >= 1) {
            result = "创建于" + parseInt(hourC) + "个小时前";
        } else if (minC >= 1) {
            result = "创建于" + parseInt(minC) + "分钟前";
        } else
            result = "刚刚创建";
        return result;
    }

    //js函数代码：字符串转换为时间戳
    function getDateTimeStamp(dateStr) {
        var time_stamp = Date.parse(dateStr.replace(/-/gi, "/"));
        return getDateDiff(time_stamp)
    }

</script>

</html>